import React,{Component} from 'react'
import {Link,browserHistory} from 'react-router'
import * as pub from '../config/public'
import * as fetch from '../config/fetch'
import {message,Button} from 'antd'
import Layer from './Layer';

class CourseBig extends Component {
	constructor(args) {
		super();
		this.state = {
			course:{},
			 visibleDH:false,
		}
	}
	
	operate(id,type){
		fetch.operateCourse(id,type).then((data)=>{
			if(data.result === 'RC100'){
				message.success(data.msg, 3);
				this.props.show();
			}else{
				message.error(data.errMsg, 3);
			}
		}, (res) => {
			pub.reject(res);
		})
	}

	confirmBuy(id,type){
		let course = this.props.course;
		if(course.userCourseOperation.isBuy===1){
			if(id!==undefined){
				this.operate(course.courseId,type);//按收藏按钮
			}else{
				pub.jumpHistory.push("/CourseDetail/" +course.courseId);//按视频和文字
			}
		}else{
			this.setState({
				visibleDH:true,
			})
		}
	}

	ok(id,code){
		pub.loading(this,true);
		fetch.operateCourses(id,code).then((data)=>{
			if(data.result === 'RC100'){
				message.success(data.errMsg, 3)
				pub.jumpHistory.push("/CourseDetail/" +id)
			}else{
				message.error(data.errMsg, 3);
			}
			pub.loading(this,false);
		}, (res) => {
			pub.reject(res);
			pub.loading(this,false);
		})
	}

	render(){
		let course = this.props.course;
		return(
					<div className="panel-120 bg-FFFFFF box-shadow">
						
						<div className="course-list">
                             {course.goodCourse==='1'?
                             	
									<video 
										src={pub.getFile(course.coursevideoPath)} 
										width="100%"  
										height="100%" 
										onClick={()=>this.confirmBuy()}
						
										className="v-img"
										>
										
									</video>:
								<Link to={`/CourseDetail/${this.props.id}`} className="v-img"> 
									<video 
										src={pub.getFile(course.coursevideoPath)}   
										width="100%"  
										height="100%" 
										className="v-img"
										>
								
									</video>
							 	</Link>
							 }



							<div className="v-info">
								<div className="v-author">
									<img alt='head' src={pub.getFile(course.headPath)} onError={(e) => pub.headImageError(e)}/>
									<div className="author-info">
										<p className='shorthand'><span>{course.userRealName}</span><span >{course.branchOffice}</span></p>
										<span>{pub.formatTimestamp(course.createTime)}</span>
									</div>
								</div>
								<div className="v-cont">
									<h3>{course.courseName}</h3>
									<p className='shorthand'>{course.courseDesc?pub.subString(course.courseDesc,100):'没有描述'}</p>
								</div>
								<div className="collect-like">	
									{course.goodCourse==='0'?
									<span style={{opacity:course.userCourseOperation !== undefined && course.userCourseOperation.isCollection === 1 ? 1:0.4}} onClick={()=>this.operate(course.courseId,2)} >
									<i className="icon-heart" ></i>{course.sumCollection}</span>:
									<span style={{opacity:course.userCourseOperation !== undefined && course.userCourseOperation.isCollection === 1 ? 1:0.4}} onClick={()=>this.confirmBuy(course.courseId,2)} >
									<i className="icon-heart" ></i>{course.sumCollection}</span>
									}
									<span style={{opacity:course.userCourseOperation !== undefined && course.userCourseOperation.isLike === 1 ? 1:0.4}} onClick={()=>this.operate(course.courseId,3)} >
									<i className="icon-thumbs-up"></i>{course.sumLike}</span>
								</div>
							</div>
							{course.goodCourse === '1'?<div className="jing"></div>:null}
						</div>

						<Layer 
				            title = "设置兑换积分"
				            show={this.state.visibleDH} 
				            hide={(e)=>{this.setState({visibleDH:false,loading:false})}}
				            width="400px"
				            height="270px"
			                >
				            	<div className="row">
				            			<div className="pop-box-1"  style={{textAlign:'left'}}>																					
				            				<p style={{textAlign:'center'}}>您需要{course.studyIntegral}积分兑换该课程</p>																				
				            			</div>
				            			<div className="pop-btn">
				            				<Button loading={this.state.loading} onClick={()=>{this.setState({visibleDH:false})}} className="btn btn-blue"  style={{borderRadius: '5px',marginRight:'50px'}}>取消</Button>
				            				<Button loading={this.state.loading} className="btn btn-blue" style={{borderRadius: '5px'}} onClick={()=>this.ok(course.courseId,course.userCode)}>确认
				            				</Button>
				            			</div>
				            		</div>
			                </Layer>
					</div>
			)
	}
}
export default CourseBig;